<div class="row">
	<div class="col-md-12">
		<ol class="breadcrumb">
			<li>
				<a href="#" onclick="toHome()">
					主页
				</a>
			</li>
			<li>
				<a href="#" onclick="toMovieSchedule()">
					电影排期列表
				</a>
			</li>
			<li class="active">
				确认购票
			</li>
		</ol>
	</div>
</div>
<form role="form" class="form-horizontal">
	<div class="row page-cont">
		<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 cont-top">
			<div class="panel panel-white">
				<div class="panel-heading">
					<h4 class="panel-title">
						<span class="title-text">电影票列表</span>
					</h4>
					<div class="panel-tools">
						<div class="dropdown">
							<a data-toggle="dropdown" class="btn btn-xs dropdown-toggle btn-transparent-grey">
								<i class="fa fa-cog"></i>
							</a>
							<ul class="dropdown-menu dropdown-light pull-right" role="menu">
								<li>
									<a class="panel-collapse collapses" href="#"><i class="fa fa-angle-up"></i> <span>折叠</span> </a>
								</li>
								<li>
									<a class="panel-expand" href="#">
										<i class="fa fa-expand"></i> <span>全屏</span>
									</a>
								</li>
							</ul>
						</div>
						<a class="btn btn-xs btn-link panel-close" href="#">
							<i class="fa fa-times"></i>
						</a>
					</div>
				</div>
				<div class="panel-body">
					<table class="table table-bordered table-hover order-table">
						<thead>
							<tr>
								<th class="hidden-xs">影片名称</th>
								<th class="hidden-xs">影院名称</th>
								<th class="hidden-xs">影厅</th>
								<th class="hidden-xs">开场时间</th>
								<th class="hidden-xs">价格</th>
								<th class="hidden-xs">电影版本</th>
								<th class="hidden-xs">最大购票数</th>
								<th class="hidden-xs">购票数</th>
							</tr>
						</thead>
						<tbody>

						</tbody>
					</table>
					<div class="form-group">
				  		<label class="col-sm-2 control-label">请输入手机号</label>
					    <div class="col-sm-5">
					      <input type="text" class="form-control" id="mobile" />
					    </div>
				  	</div>
				  	<div class="form-group">
				  		<div class="col-sm-2 col-sm-offset-3">
				  			<button type="button" class="btn btn-danger oreder-btn">提交&nbsp;<i class="fa fa-arrow-circle-right"></i></button>
				  		</div>
				  	</div>
				</div>
			</div>
		</div>
	</div>
</form>
<script>
	/*********************************变量*******************************************/
	var username = GetQueryString("username");    // 用户姓名
	var token = MXCookie.get("token",token);      // 登陆token
	var idArr = localStorage.idArr;               // 排期Id
	var ticketArr = [];                           // 票数数组
	var counts;                                   // 票数

	/*********************************事件*******************************************/
	// 提交
	$(".oreder-btn").click(function(){
		for(var i = 0; i < $(".ticket-num").length; i++){
			ticketArr.push($(".ticket-num").eq(i).val());
		}
		if(msgCheck()){
			counts = ticketArr.join(",");
			submitOrder(counts);
		}
	});


	/*********************************函数*******************************************/
	// 获取列表
	$.ajax({
		url: localStorage.grobalUrl + "/schedule/readySave",
		type: "post",
		data:{
			username: username,
			token: token,
			scheduleId: idArr,
		},
		success: function(data){
			console.log(data);
			if(data.errCode == "00005"){
				tips("请重新登陆");
				setTimeout(function(){
					window.location.href = "login_login.html";
				},500);
			}else if(data){
				var str = '<tr align="center">'+
							'<td class="movie-name"></td>'+
							'<td class="film-name"></td>'+
							'<td class="movie-hall"></td>'+
							'<td class="open-time"></td>'+
							'<td class="price"></td>'+
							'<td class="version"></td>'+
							'<td class="max-num"></td>'+
							'<td class="total-num"><input type="text" class="ticket-num" /></td>'+
						'</tr>'
				for(var i = 0; i < data.length; i++){
					var dataVal = data[i];
					$("tbody").append(str);
					$(".movie-name").eq(i).text(dataVal.film_name);
					$(".film-name").eq(i).text(dataVal.cinema_name);
					$(".movie-hall").eq(i).text(dataVal.hall_name);
					$(".open-time").eq(i).text(dataVal.show_time);
					$(".price").eq(i).text(dataVal.price);
					$(".version").eq(i).text(dataVal.show_version);
					$(".max-num").eq(i).text(dataVal.max_can_buy);
				}
				// input输入事件
				$(".ticket-num").keyup(function(){
					var index = $(".ticket-num").index(this);
					if(!$(this).val().match(/^\+?[1-9]\d*$/)){
						tips("请填写大于零的正整数");
						$(this).focus();
					}else{
						if(Number($(this).val()) > Number($(".max-num").eq(index).text())){
							$(this).val($(".max-num").eq(index).text());
						}
					}
				});
			}				
		},
		error: function(err){
			console.log(err);
		}
	});
	

	// 提交
	function submitOrder(counts){
		$.ajax({
			url: localStorage.grobalUrl + "/schedule/orderTicket",
			type: "post",
			data:{
				username: username,
				token: token,
				mobile: $("#mobile").val(),
				scheduleId: idArr,
				counts: counts,
			},
			success: function(data){
				console.log(data);
				getPage("view/movieSchedule/list.html");
			},
			error: function(err){
				console.log(err);
			}
		});
	}

	// 信息验证
	function msgCheck(){
		if($(".ticket-num").val() == ""){
			tips("请填写购票数");
			return false;
		}else if($("#mobile").val() == ""){
			tips("请填写手机号");
			$(this).focus();
			return false;
		}else if($("#mobile").val() != "" && !$("#mobile").val().match(/^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/)){
			tips("请填写正确的手机号");
			$(this).focus();
			return false;			
		}else{
			return true;
		}
	}

</script>
